<template>
  <div class="user-avator-dropdown">
    <Dropdown @on-click="handleClick">
      <Avatar :src="userAvator" />
      <Icon :size="18" type="md-arrow-dropdown"></Icon>
      <DropdownMenu slot="list">
        <DropdownItem name="logout">退出登录</DropdownItem>
      </DropdownMenu>
    </Dropdown>
  </div>
</template>

<script>
import "./user.less";
import { mapActions } from "vuex";
import { logout } from "@/api/user";
export default {
  name: "User",
  props: {
    userAvator: {
      type: String,
      default: "",
    },
  },
  methods: {
    handleClick(name) {
      switch (name) {
        case "logout":
          // localStorage.clear();
          // this.$router.push({
          //   name: "login",
          // });
          localStorage.clear();
          logout().then((res) => {
            this.$router.push({
              name: "login",
            });
          });
          break;
      }
    },
  },
};
</script>
